import React, { Suspense } from 'react'
import { BrowserRouter, Route, Routes, Navigate } from "react-router-dom";
import { ROUTERVIEWRTYPE,ROUTERTYPE } from "../types/router.d"
import routes from "../router/routerConfig"
function routerView() {
    const renderRouter = (routes: ROUTERTYPE[]) => {
        return routes.map((item: any, index: number) => {
            return <Route key={index} path={item.path} element={item.to ? <Navigate to={item.to} /> : <item.component />}>
                {
                    item.children && renderRouter(item.children)
                }
            </Route>
        })
    }
    return (

        <Suspense fallback={<div>正在加载中。。。。</div>}>
            <BrowserRouter>
                <Routes>
                    {
                        renderRouter(routes)
                    }
                </Routes>
            </BrowserRouter>
        </Suspense>
    )
}

export default routerView